// PostCSS 的配置文件
// PostCSS 是基于 Node.js 运行的一个处理 CSS 的工具
//  所以它的配置文件也是运行在 Node.js 中

// PostCSS 配置文件需要导出一个对象
module.exports = { // 用的是 Node.js 中的导出规范
    // 配置要使用的相关插件
    plugins: {
        // 自动添加浏览器厂商声明前缀,用来兼容不同的浏览器
        // VueCLI 已经内部默认配置了 autoprefixer
        // 'autoprefixer': {
        //     // browsers 用来配置要兼容到的系统(浏览器)环境
        //     browsers: ['Android >= 4.0', 'ios >= 8']
        // },
        // 把 px 转换为 rem
        'postcss-pxtorem': {
            // 装换的根元素基准值
            // 正常情况下按照你的设计稿来
            // 例如750 宽的设计稿, 750 / 10 = 75
            // 例如375 宽的设计稿, 375 / 10 = 37.5
            // Vant 组件库是基于逻辑像素 375 宽写的
            // 设计稿都是基于物理像素 750 宽设计的
            // 移动端页面一般都是基于 iphone 6/7/8 为原型设计的
            // 75, 设计稿多少写多少的话, Vant 的样式会变的很小, 小了一半
            // 在测量设计稿宽的时候,所以我们必须除以一半

            // 不用计算的方法,就是调整ps软件的长度
            rootValue: 37.5,
            // 用来配置你要转换的 CSS 属性, * 就是就是所有属性都要转换
            // propList 可以写你只要转的属性,类似于 font-size, width 等等
            propList: ['*']
        }
    }
}